import { QualityTestItem } from '@/services/qualityTest';
import type { ProFormInstance } from '@ant-design/pro-components';
import {
  ModalForm,
  ProFormDatePicker,
  ProFormText,
} from '@ant-design/pro-components';
import { useRef } from 'react';

export type MaterialModalProps = {
  visible: boolean;
  onVisibleChange: (visible: boolean) => void;
  initialValues?: Partial<QualityTestItem>;
  onSuccess: () => void;
};

const QualityTestModal: React.FC<MaterialModalProps> = ({
  visible,
  onVisibleChange,
  initialValues,
}) => {
  const formRef = useRef<ProFormInstance>();

  return (
    <ModalForm<Omit<QualityTestItem, 'id' | 'sales'>>
      formRef={formRef}
      title={initialValues ? '编辑质检信息' : '新增质检信息'}
      open={visible}
      onOpenChange={onVisibleChange}
      modalProps={{
        destroyOnClose: true,
        maskClosable: false,
      }}
      initialValues={initialValues}
      preserve={false}
      onFinish={async (values) => {
        console.log(values);
      }}
    >
      <ProFormText
        name="batch"
        label="质检批次"
        placeholder="请输入质检批次"
        rules={[{ required: true, message: '请输入质检批次' }]}
      />

      <ProFormText
        name="principal"
        label="质检人员"
        placeholder="请输入质检人员姓名"
        rules={[{ required: true, message: '请输入质检人员姓名' }]}
      />
      <ProFormText
        name="place"
        label="质检车间"
        placeholder="请输入质检车间"
        rules={[{ required: true, message: '请输入质检车间' }]}
      />
      <ProFormText
        name="quantity"
        label="合格情况"
        placeholder="请输入合格情况"
        rules={[{ required: true, message: '请输入合格情况' }]}
      />

      <ProFormDatePicker width="md" name="date" label="质检日期" />
      <ProFormText
        name="reason"
        label="返工原因"
        placeholder="请输入返工原因"
        rules={[{ required: true, message: '请输入返工原因' }]}
      />
    </ModalForm>
  );
};

export default QualityTestModal;
